﻿@model ViewModels.GuestBookVM.GuestBookMainVM

@{
    ViewBag.Title = "Hinoky.com :::: 방명록";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<script src="~/Scripts/jquery.signalR-2.0.2.js"></script>
<script src="~/signalr/hubs"></script>

<style type="text/css">
    .title-area h3{
        margin-top:0;
    }
</style>

<script type="text/javascript">
    $(document).ready(function () {
        $("#btnSave").on("click", function() {
            if ($("#txtWriterName").val() == "") {
                return alert("이름을 입력해주세요.");
            }
            
            if ($("#txtComment").val() == "") {
                return alert("댓글 내용을 입력해 주세요.");
            }

            if ($("#txtChpchVal").val() != chapcharval) {
                return alert("문제의 정답을 맞춰주세요. 정답은 '" + chapcharval + "'!!");
            }

            var isPrivateVal = $("#chkIsPrivate").is(":checked");
            
            if (isPrivateVal) {
                if (!confirm("등록후엔 운영자외 수정/삭제가 불가합니다. 등록하시겠습니까?")) return false;
            }
            else
            {
                if (!confirm("등록후엔 운영자외 수정/삭제가 불가합니다. 등록하시겠습니까?")) return false;
            }

            saveContent();
        });

        $("#chkIsPrivate").on("click", function() {
            if ($(this).is(":checked")) {
                $("#divContract").show();
            } else {
                $("#divContract").hide();
            }
        });

        /* Chatchar Val 영역 설정 */
        var chapcharval = '@ViewBag.ChaptchaVal';
        var firstKey = Math.floor((Math.random() * chapcharval) + 1);
        var secondKey = chapcharval - firstKey;

        $("#chpch1").html(firstKey);
        $("#chpch2").html(secondKey);

        /* Chatchar Val 영역 설정 */
        function saveContent() {
            var nameVal = htmlEscape($("#txtWriterName").val());
            var commentVal = htmlEscape($("#txtComment").val());
            var isPrivateVal = $("#chkIsPrivate").is(":checked");

            $.ajax({
                type: "POST",
                async: true,
                url: "/GuestBook/Create",
                data: { LocationCode:'@ViewBag.Location', SubKey:'@ViewBag.SubKey', GuestName: nameVal, Comment: commentVal, IsPrivate: isPrivateVal, SecureEmailAddress : $("#txtComment").val() },
                datatype: 'json',
                traditional: true,
                success: function (data) {
                    if (data.Success == true) {
                        alert("등록되었습니다.");
                        location.href = "/GuestBook/index";
                        
                        //guestBookHub.server.send($("#displayname").val(), $("#message").val());
                    }
                    else {
                        alert("등록에 실패하였습니다.");
                        location.href = "/GuestBook/index";
                    }
                },
                beforeSend: function () {
                    //showLoadingLayer();
                },
                complete: function () {
                    //hideLoadingLayer();
                },
                error: function (xhr, status, error) {
                    alert(error);
                }
            });
        }
    });

    // 댓글 등록
    function addReply(parentSeqNo) {
        var nameVal = htmlEscape($("#txtReplyWriter_" + parentSeqNo).val());
        var userKeyVal = 0;
        var commentVal = htmlEscape($("#txtReply_" + parentSeqNo).val());

        $.ajax({
            type: "POST",
            async: true,
            url: "/GuestBook/AddReply",
            data: { ParentIdx:parentSeqNo, GuestName: nameVal, UserKey: userKeyVal, Comment: commentVal, IsPrivate: false },
            datatype: 'json',
            traditional: true,
            success: function (data) {
                if (data.Success == true) {
                    alert("등록되었습니다.");

                    var html = "";
                    html += "<img src='/Images/reply.jpg' alt='Reply' style='width:10px' /> [Write By " + data.GuestName + "]&nbsp;" + data.Comment + " <i>(" + data.InsertDate + ")</i>";
                    
                    if ('@ViewBag.IsAdmin' == 'True') {
                        html += " <a href='#' style='color:red' onclick='removeGuestBook("+ data.Idx +"); return false;' >[X]</a>";
                    }

                    html += "<br />";
                    
                    $("#replyListArea_" + parentSeqNo).prepend(html);
                    $("#txtReplyWriter_" + parentSeqNo).val("");
                    $("#txtReply_" + parentSeqNo).val("");
                }
                else {
                    alert("등록에 실패하였습니다.");
                    location.href = "/GuestBook/index";
                }
            },
            beforeSend: function () {
                //showLoadingLayer();
            },
            complete: function () {
                //hideLoadingLayer();
            },
            error: function (xhr, status, error) {
                alert(error);
            }
        });
    }
    
    function removeGuestBook(idx) {
        if (!confirm("삭제하시겠습니까?")) return false;
        
        $.ajax({
            type: "POST",
            async: true,
            url: "/guestbook/removeguestbook",
            data: { idx:idx },
            datatype: 'json',
            traditional: true,
            success: function (data) {
                if (data.Success == true) {
                    alert("삭제되었습니다.");
                    location.href = location.href;
                }
                else {
                    alert("삭제에 실패하였습니다");
                    location.href = location.href;
                }
            },
            beforeSend: function () {
                //showLoadingLayer();
            },
            complete: function () {
                //hideLoadingLayer();
            },
            error: function (xhr, status, error) {
                alert(error);
            }
        });
    }
</script>

<div class="bs-callout bs-callout-info title-area">
    <h3>GuestBook</h3>
    <p />
    <p>MS SignalR 2.0 을 사용하여 만든 RealTime 방명록 입니다. 뻥이야!!!</p>
</div>

<div   class="featurebox_center">
    
    @*<table style="font-size:1.2em;font-family:Segoe UI, Verdana, Helvetica, Sans-Serif; width:100%">
        <tr>
            <td style="width:100px">
                WriterName
            </td>
            <td>
                <input type="text" id="txtWriterName" class="dashedtb" style="width:250px" />&nbsp;&nbsp;&nbsp;
                비밀글 여부 <input type="checkbox" id="chkIsPrivate" />&nbsp;&nbsp;&nbsp;

            </td>
        </tr>
        <tr> 
            <td>
                 
            </td>
            <td style="vertical-align:bottom" >
                <div id="divContract" style="display:none" >
                    <input type="text" id="txtContract" name="txtContract" value="" style="width:200px" maxlength="100" />&nbsp;<span style="color:red">비밀글은 반드시 연락처를 남겨야 합니다.</span>
                </div>
                <textarea id="txtComment" style="width:80%" rows="2" ></textarea>&nbsp; 
                <span class="button large icon"><span class="add"></span><input type="button" id="btnSave" value="Save"/></span>
            </td>
        </tr>
    </table>*@
    
    <form id="comment-form" role="form" class="form-horizontal">
        <div class="form-group">
            <div class="row" >
                <div class="col-xs-6">
                    <label for="txtWriterName">이름</label>
                    <div class="input-group">
                        <input type="text" id="txtWriterName" name="txtWriterName" value="" class="form-control">			
                        <span class="input-group-addon">
                            <input type="checkbox" id="chkIsPrivate">
                        </span>
                    </div>
                    <label class="text-primary" >비밀글을 입력하시려면 check박스를 선택해 주세요.</label>
                </div>
                <div id="divContract" class="col-xs-6" style="display:none" >
                    <label for="txtContract">연락처 / Email</label>
                    <input type="text" id="txtContract" name="txtContract" value="" class="form-control">			
                    <label class="text-primary">비밀글로 등록하시면 방명록에 보이지 않으며, 등록하신 연락처로 주인장이 답변을 드립니다.</label>
                </div>
            </div>
            <div class="col-xs-12">
                <label for="txtComment">Comment</label>        
                <textarea id="txtComment" class="form-control"></textarea><br>
                <div>
                    <label for="txtChpchVal">자동입력 방지 : </label>[<span id="chpch1"></span>] 더하기 [<span id="chpch2"></span>] 은? 
                    <input type="text" id="txtChpchVal" name="txtChpchVal" value="" />
                </div>
                <div class="pull-right">
                    <input class="btn btn-info" id="btnSave" value="Submit Comment" type="button"><br />
                </div>        
            </div>    
        </div>
    </form>
</div>

<br />

<div id="divArticleList" class="featurebox_center">
    @foreach (var item in Model.GuestBookList)
    {
        <table style="font-size:1.2em;font-family:Segoe UI, Verdana, Helvetica, Sans-Serif; margin-top:10px; padding:10px; width:100%; border-width:1px; border-style:solid; border-color:@(item.IsPrivate ? "orange" : "gray")" >
            <tr>
                <td style="width:50%" >
                    @if (item.IsPrivate)
                    {
                        <span style="color:red">[비밀글]</span>
                    }
                    Write By <b>@item.GuestName
                                 @if (!string.IsNullOrEmpty(item.GuestId))
                                 {
                                     @Html.Raw("(" + item.GuestId + ")")
                                 }</b>&nbsp;
                    @if (ViewBag.IsAdmin)
                    {
                        <a href="#" style="color:red" onclick="removeGuestBook(@item.Idx); return false;" >[X]</a>
                    }
                    <input type="hidden" id="hidIdx" name="hidIdx" value="@item.Idx" />
                </td>
                <td style="text-align:right" > @item.InsertDate.ToString("yyyy-MM-dd hh:mm:dd") </td>
            </tr>
            <tr>
                <td colspan="2">
                    <hr style="border-style:dotted" />
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    @item.Comment
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <hr />
                    <div id="@Html.Raw("replyListArea_" + item.Idx)">
                        @foreach (var replyItem in item.ReplyList)
                        {
                            @Html.Raw(string.Format("<img src='/Images/reply.jpg' alt='Reply' style='width:10px' /> [Write By {0}]&nbsp;{1} <i>({2})</i>", replyItem.GuestName, replyItem.Comment, replyItem.InsertDate.ToString("yyyy-MM-dd hh:mm:ss")))
                            if (ViewBag.IsAdmin)
                            {
                                <a href="#" style="color:red" onclick="removeGuestBook(@replyItem.Idx); return false;" >[X]</a>
                            }
                            <br />
                        }
                    </div>
                    <div id="replyWriteArea" style="padding:10px" >
                        <input type="text" id="@Html.Raw("txtReplyWriter_" + item.Idx)" value="" style="width:15%" />&nbsp;
                        <input type="text" id="@Html.Raw("txtReply_" + item.Idx)" value="" style="width:50%" />&nbsp;
                        <input type="button" id="btnReply" value="답변달기" onclick='addReply(@item.Idx)' />
                    </div>
                </td>
            </tr>
        </table>
    }
</div>




